<template>
    <div class="App">
        <!-- 头部组件 -->
        <HmHeader></HmHeader>
        <!-- 内容区域 -->
        <HmMain></HmMain>
        <!-- 底部组件 -->
        <HmFooter></HmFooter> 
    </div>
</template>

<script>
import HmHeader from '@/components/HmHeader.vue'
import HmFooter from '@/components/HmFooter.vue'
import HmMain from '@/components/HmMain.vue'  
export default {
    components:{
        'HmHeader':HmHeader,
        HmFooter:HmFooter,
        HmMain
    } 

}
</script>

<style>
.App {
    width: 600px;
    height: 700px;
    background-color: #87ceed;
    margin: 0 auto;
    padding: auto;
}
</style>>